<template>
    <el-select :value="value ? value.earmark : ''" @input="$emit('input', $event)" @change=selectChange() :placeholder="placeholder" filterable remote reserve-keyword clearable>
        <el-option :label="data.earmark" v-for="data in dataList" :key="data.id" :value ="data">{{data.earmark}}</el-option>
    </el-select>
</template>
<script>
export default {
  name: 'Earmark',
  data () {
    return {
      dataList: []
    }
  },
  props: {
    value: [Object],
    gender: [Number, String],
    house: String,
    placeholder: String
  },
  mounted () {
    this.getDataList()
  },
  created () {
    this.getDataList()
  },
  methods: {
    getDataList () {
      var url = '/stock/pig/getAllEarMarks'
      if (this.gender != null) {
        url += '?gender=' + this.gender
      }
      if (this.house != null) {
        url += '?house=' + this.house
      }
      return this.$http.get(url).then(({ data: res }) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg)
        }
        this.dataList = res.data
      }).catch(() => {})
    },
    selectChange () {
      this.$emit('earmarkChange', this.value)
    }
  }
}
</script>
